<template>
	<view class="content">
		<image class="logo" src="/static/logo.png" />
		<view class="text-area flex flex-col items-center justify-center">
			<text class="title">
				{{ title }}
			</text>
			<text class="text-red font-bold text-12 mt-10">
				Hello World
			</text>
		</view>
	</view>
</template>

<script setup lang="ts">
import { ResultData } from '@/utils/http';


const title = ref('Hello World');

// 模拟一个异步操作
const userInfoHandle = async (): Promise<ResultData<string>> => {
	console.log('userInfoHandle');
	return {
		data: '123',
		success: true,
		code: 200,
		message: 'Success',
	};
};
const initialData = undefined;

const { run, loading, error, data } = useAsyncRequest(userInfoHandle, {
	immediate: true
});

setTimeout(()=> {
	console.log(initialData, data.value);
}, 3000)
</script>

<style>
.content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.logo {
	height: 200rpx;
	width: 200rpx;
	margin-top: 200rpx;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 50rpx;
}

.text-area {
	display: flex;
	justify-content: center;
}

.title {
	font-size: 36rpx;
	color: #8f8f94;
}
</style>
